{% extends 'base.html' %}
{% load static %}

{% block mycss %}
    <link rel="stylesheet" href="{% static 'css/font.css' %}">
    <link rel="stylesheet" href="{% static 'js/lib/layui/css/layui.css' %}">

    <link rel="stylesheet" href="{% static 'css/xadmin.css' %}">
    <link rel="stylesheet" href="{% static 'css/common.css' %}">
    <!-- <link rel="stylesheet" href="./css/theme5.css"> -->
    <script src="{% static 'js/lib/layui/layui.js' %}" charset="utf-8"></script>
    <script type="text/javascript" src="{% static 'js/xadmin.js' %}"></script>

{% endblock %}

{% block content %}
    <div class="layui-container">
        <div class="layui-row" style="padding: 30px">
            <form method="post" id="myForm" action="{% url 'api_add' %}">

                <div style="margin: 10px 0 20px;">
                    <div style="margin-top: 10px;margin-bottom: 10px;">

                        <label for="api_name" style="font-weight: bold;color: #333333">
                            接口名称
                        </label>
                    </div>
                    <input class="layui-input my-input" type="text" id="api_name" name="api_name"
                           autocomplete="off">
                </div>

                <div style="margin: 10px 0 20px;">
                    <div style="margin-top: 10px;margin-bottom: 10px;">

                        <label for="api_type" style="font-weight: bold;color: #333333">
                            接口类型
                        </label>
                    </div>
                    <select class="my-select" id="api_type"
                            style="width: 100%;height: 38px" name="api_type">
                        {% for api in api_objs %}
                            <option value="{{ api.id }}">{{ api.name }}</option>
                        {% endfor %}
                    </select>
                </div>

            </form>
            <div>
                <button style="float: right;margin: 30px 0 0;" class="my-btn" id="saveBtn">
                    保存
                </button>
            </div>
        </div>
    </div>
{% endblock %}
{% block myjs %}
    <script>
        $('#saveBtn').click(function () {
            var form = document.querySelector("#myForm");
            var formdata = new FormData(form);
            $.ajax({
                url: '{% url 'api_add' %}',
                type: 'post',
                data: formdata,
                contentType: false,
                processData: false,
                success: function (res) {
                    console.log(res)
                    if (res.status == 1) {
                        xadmin.close();
                        window.parent.location.reload();
                    } else {
                        alert(res["msg"]);
                    }
                }
            })
        })
    </script>
{% endblock %}

